import axios from "axios";
import React from "react";
import { useSearchParams } from "react-router-dom";
import { Button } from "react-vant";

const Index: React.FC = () => {
  // 方式一
  // const price = JSON.parse(localStorage.getItem('price') as string)
  // 方式二
  // const { price } = useParams()
  // const price = 123
  // console.log(totalPrice)
  // 方式三：
  // const location = useLocation();
  // const price = location.state.totalPrice
  // 方式四
  const [searchParams] = useSearchParams();
  const price = searchParams.get('price')
  
  const id = new Date().getTime();
  const title = "测试标题";
  const pay = async () => {
    const resp = await axios.post('/api/payment', { price, id, title })
    console.log(resp.data);
    window.location.href = resp.data.data
  }
  return (
    <div>
      <div>总价： { price }</div>
      <div>单号 { id }</div>
      <div>标题 { title }</div>
      <Button onClick={() => pay()}>立即付款</Button>
    </div>
  );
};

export default Index;
